<script setup lang="ts">
import { ref } from 'vue';

// const tp = ref([
//     'https://img.youpin.mi-img.com/ferriswheel/e420b669_f1c5_455b_b1cc_f6230cd23a37.jpeg',
//     'https://img.youpin.mi-img.com/ferriswheel/5d64095f_9f45_4e5f_9fc5_d82c0f114e6f.jpeg']
// )


const tableData = [
    {
        id: '100000001',
        price: '4599',
        name: '小米13',
    },{
        id: '100000002',
        price: '1599',
        name: '华为play6',
    },{
        id: '100000003',
        price: '4599',
        name: '荣耀6',
    },{
        id: '100000004',
        price: '4599',
        name: '华为9',
    },
]
</script>

<template>
    <!-- <el-carousel height="700px">
            <el-carousel-item v-for="item in tp" :key="item">
              <el-image :src="item" fit="fill" />
            </el-carousel-item>
          </el-carousel> -->
    <div style="margin: 50px 500px 0 500px;">
        <h1 class="mx-1" size="large" style="margin-bottom: 40px;">订单</h1>
        <el-table :data="tableData" style="width: 100%">
            <el-table-column prop="id" label="订单号" />
            <el-table-column prop="price" label="订单金额" />
            <el-table-column prop="name" label="商品名称" />
            <el-table-column>
                <template #default="scope">
                    <el-button size="small"  type="primary" @click="handleEdit(scope.$index, scope.row)">详情</el-button>
                    <el-button size="small" type="success" @click="handleDelete(scope.$index, scope.row)">确认收货</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div style="margin-top: 200px;">
            <el-pagination layout="prev, pager, next" :total="4" />
        </div>
    </div>
</template>

<style scoped></style>
